import 'package:flutter/material.dart';

import '../common_image.dart';

class MySearchBar extends StatefulWidget {
  final bool? showLocation; //是否显示位置
  final Function? goBackCallback; //回退
  final String? inputValue; //搜索框值
  final String defaultInputValue; //默认显示值
  final Function? onCancel; //取消按钮
  final bool? showMap; //是否显示地图按钮
  final Function? onSearch; //点击搜索框触发
  final ValueChanged<String>? onSearchSubmit;

  const MySearchBar(
      {super.key,
      this.showLocation,
      this.goBackCallback,
      this.inputValue = '',
      this.defaultInputValue = '请输入搜索词',
      this.onCancel,
      this.showMap,
      this.onSearch,
      this.onSearchSubmit}); // 点击回车触发

  @override
  State<MySearchBar> createState() => _SearchBarState();
}

class _SearchBarState extends State<MySearchBar> {
  String _searchWord = '';
  late TextEditingController _controller;
  late FocusNode _focusNode;
  //点击叉号清除内容
  void onClear() {
    _searchWord = '';
    _controller.clear();
  }

  @override
  void initState() {
    super.initState();
    _focusNode = FocusNode();
    _controller = TextEditingController(text: widget.inputValue);
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: const BoxDecoration(color: Colors.white),
      child: Row(
        children: [
          // 是否显示位置
          // 默认为 false
          if (widget.showLocation ?? false)
            Container(
              padding: const EdgeInsets.only(right: 10.0),
              child: GestureDetector(
                onTap: () {},
                child: const Row(
                  children: [
                    Icon(
                      Icons.room,
                      size: 14,
                      color: Colors.green,
                    ),
                    Text(
                      "上海",
                      style: TextStyle(color: Colors.black, fontSize: 14),
                    )
                  ],
                ),
              ),
            ),
          //返回按钮
          if (widget.goBackCallback != null)
            Padding(
              padding: const EdgeInsets.only(right: 10.0),
              child: GestureDetector(
                onTap: () {
                  widget.goBackCallback!();
                },
                child: const Icon(Icons.chevron_left),
              ),
            ),
          // 弹性输入框
          Expanded(
              child: Container(
            height: 38,
            decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(30),
                color: Colors.grey.shade200),
            child: TextField(
              controller: _controller, // 控制正在编辑的文档
              focusNode: _focusNode, // 控制焦点
              onTap: () {
                if (widget.onSearchSubmit == null) {
                  _focusNode.unfocus(); // 不是搜索页则失去焦点
                }
                if (widget.onSearch != null) {
                  widget.onSearch!();
                }
              },
              textInputAction: TextInputAction.search, // 键盘回车文本
              style: const TextStyle(fontSize: 20.0),
              onSubmitted: widget.onSearchSubmit,
              onChanged: (value) {
                setState(() {
                  _searchWord = value;
                });
              },
              decoration: InputDecoration(
                  contentPadding: const EdgeInsets.only(top: 1, left: -10),
                  hintText: widget.defaultInputValue,
                  hintStyle: const TextStyle(color: Colors.grey, fontSize: 14),
                  border: InputBorder.none,
                  suffixIcon: GestureDetector(
                    onTap: () {
                      onClear();
                    },
                    child: Icon(
                      Icons.clear,
                      size: 18.0,
                      color: _searchWord == ''
                          ? Colors.grey.shade200
                          : Colors.grey,
                    ),
                  ), //去除下划线
                  icon: const Padding(
                    padding: EdgeInsets.only(left: 10, top: 2),
                    child: Icon(
                      Icons.search,
                      size: 18.0,
                      color: Colors.grey,
                    ),
                  )),
            ),
          )),
          // 取消按钮
          if (widget.onCancel != null)
            Padding(
              padding: const EdgeInsets.only(right: 10),
              child: GestureDetector(
                onTap: (widget.onCancel ?? () {}) as GestureTapCallback,
                child: const Text(
                  '取消',
                  style: TextStyle(
                      fontSize: 14,
                      color: Colors.black,
                      fontWeight: FontWeight.w600),
                ),
              ),
            ),
          // 显示地图
          if (widget.showMap ?? false)
            const CommonImage(
              src: 'static/icons/widget_search_bar_map.png',
              width: 40,
              height: 40,
            ),
        ],
      ),
    );
  }
}
